<%@include file="startUpIncludes.jsp" %>
  <%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Accounts</title>
<script type="text/javascript" src="../js/jquery1-8.js"></script>
<script type="text/javascript" src="../js/jquery-ui-core.js"></script>
<script type="text/javascript" src="../js/jquery-ui-widget.js"></script>
	 <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../js/modalwin.js"></script>
<script type="text/javascript">
    $(document).ready (function () {
    	$('.delete').click (function () {
    		return confirm ("Are you sure you want to " + $(this).attr ("title") + "?") ;
    	}) ; 
    }) ;
</script>
<script type="text/javascript">
function validateForm()
{
var x=document.forms["searchForm"]["query"].value;
if (x==null || x=="")
  {
  alert("You Must Input your search");
  return false;
  }
else
    return true;
}

function counterChange()
{
	//alert("inside functions");
	var a=document.getElementById("counter").value;
	//alert(a);
	window.location =  "/sales/s/accounts?count="+a;
	
}

</script>
<style>
div.scroll
{
width: 1000px;
  height: 1000px;
  overflow: auto;
}
</style>
    </head>
    <body>
    <jsp:include page="header.jsp" >
		<jsp:param value="true" name="loggedIn"/>
	</jsp:include>
    <div class="modal-win-bg">
        <div class="modal-win-box">
            <div class="modal-win-hd">
                <span class="modal-win-title"></span>
                <span class="modal-win-close">x</span>
            </div>
            <div class="modal-win-content"></div>
            <a class="form-btn modal-win-ok">OK</a>
        </div>
    </div>
    <div class="wrap">
	<div class="fitBG">
        <div class="main">
		<%@include file="basicLeftMenu.jsp" %>
            <div class="content">
				<jsp:include page="tabs.jsp" >
					<jsp:param value="accounts" name="currentPage"/>
				</jsp:include>
                <div class="tab-content">
                <h3>Accounts</h3>
                <form name="searchForm" action="/sales/s/searchAccount" method="post" class="search-form"  onsubmit="return validateForm();">                	
				<input type="text" name="query" class="TB" value="${query}"/>
                	<input type="submit" value="search" class="inf"/>
                </form>
				<div class="lead-view">
			<%--	<form name="leadView">
				<span>View Account using: </span>
				<select class="TB">
				<option value="">June 2012</option>
				<option value="">2011 Summery</option>
				<option value="">Asset Company</option>
				<option value="">All Open Accounts</option>
				</select>
				<input type="submit" value="GO" class="inf"/>
				</form>--%>
			<%--	<a href="#">Edit Selected View</a>
				<a href="#">Create New View</a> --%>
				</div>
                <div class="content-block">
                    <h4>Recent Accounts</h4>
                    <div class="action-btns">
                    <shiro:hasRole name="accountAdd">
                     <a href="/sales/s/new-account" class="form-btn">New Account</a>
                    </shiro:hasRole>
                       
               <%-->         <a class="form-btn">Change Status</a>
                        <a class="form-btn">Change Owner</a>--%> 
                    </div>
                    <c:choose>
                    <c:when test="${empty accounts}">
                    <div class="noData">No data to preview...</div>
                    </c:when>
                    <c:otherwise>
                    <div class="scroll-table">
                    <table class="recent-leads">
                        <thead>
                            <tr>
                                <th class="xxl">Action</th>
                                <th class="m">Account Name</th>
                                <th class="l">Account Owner</th>
                                <th class="l">Account Company</th>
                            </tr>
                        </thead>
                        <tbody>
                        <c:forEach items="${accounts}" var="account">
                            <tr class="even">
                                <td class="xxl">
                                <shiro:hasRole name="accountView">
                                <a href="/sales/s/viewAccount?id=${account.id}">View</a>
                                </shiro:hasRole>
                                <shiro:hasRole name="accountEdit">
                                <a href="/sales/s/edit-account?id=${account.id}">Edit</a>
                                </shiro:hasRole>
                                <shiro:hasRole name="accountDelete">
                                 <a href="/sales/s/delete-account?id=${account.id}" title="Delete the selected Account" class="delete">Delete</a>
                                </shiro:hasRole>
                               <shiro:hasRole name="accountFellow">
                               <c:choose>
                                	<c:when test="${account.isFollowed == true }">
                                		<img src="../images/icon-followed.png"/>
                                	</c:when>
                                	<c:otherwise>

                                		<a href="/sales/s/followAccount?accountId=${account.id}"><img src="../images/icon-follow.png"/></a></td>
                                	</c:otherwise>
                                </c:choose>
                               </shiro:hasRole>      
                                <td class="m">${account.accountName}</td>
                                <td class="l">${account.accountCreator.fName}</td>
                                <td class="l">${account.companyName}</td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                    </div>
                    </c:otherwise>
                    </c:choose>
                     <c:choose>
                    <c:when test="${empty accounts}">
                    </c:when>
                    <c:otherwise>
                    <c:choose>
                        	<c:when test="${index <=0 }">
                        		<span>first</span>
                        	</c:when>
                        	<c:otherwise>
                        		<a id ="first" href="/sales/s/accounts?index=${0}&pages=${pages}&count=${count}">first</a>
                        	</c:otherwise>
                        </c:choose>
                     <c:choose>
                        	<c:when test="${index <=0 }">
                        		<span>prev</span>
                        	</c:when>
                        	<c:otherwise>

                        		<a href="/sales/s/accounts?index=${index-1}&pages=${pages}&count=${count}">prev</a>
                        	</c:otherwise>
                        </c:choose>
                        --${index+1}--
                        <c:choose>
                        	<c:when test="${index+1 >=pages }">
                        		<span>next</span>
                        	</c:when>
                        	<c:otherwise>

                        		<a href="/sales/s/accounts?index=${index+1}&pages=${pages}&count=${count}">next</a>
                        	</c:otherwise>
                      </c:choose>
                      <c:choose>
                        	<c:when test="${index+1 >=pages }">
                        		<span>last</span>
                        	</c:when>
                        	<c:otherwise>
                        		<a id ="last" href="/sales/s/accounts?index=${pages-1}&pages=${pages}&count=${count}">last</a>
                        	</c:otherwise>
                        </c:choose>
                        <select id ="counter" name="counter" onchange="counterChange();">
	                        <c:choose>
                        	<c:when test="${count==5}">
                        		<option value="5" selected="selected">5</option>
                        		<option value="10">10</option>
	                            <option value="15">15</option>
                        	</c:when>
                        	<c:when test="${count==10}">
                        		<option value="5">5</option>
	                        	<option value="10" selected="selected">10</option>
	                         	<option value="15">15</option>
                        	</c:when>
                        	<c:when test="${count==15}">
                        		<option value="5">5</option>
	                        	<option value="10">10</option>
	                         	<option value="15" selected="selected">15</option>
                        	</c:when>
                        	</c:choose>
                        </select>
						</c:otherwise>
                    </c:choose>
                </div>
                </div>
            </div>
        </div>
        
	<%@include file="footer.jspf" %>
    </div>
    </div>

    </body>
</html>